<template>
  <vab-query-form>
    <vab-query-form-top-panel v-if="config_table.search">
      <el-form inline label-width="49px" :model="queryForm" @submit.prevent>
        <!-- 状态 -->
        <el-form-item v-if="config_table.status_select == true" class="z-col" label="">
          <el-select v-model.trim="queryForm.search.status" clearable filterable :placeholder="'请选择状态'">
            <el-option v-for="(item, status_index) in config_table.status_list" :key="status_index" :label="item" :value="status_index" />
          </el-select>
        </el-form-item>

        <!-- 外键单选 -->
        <template v-for="(col, col_index) in config_table.cols" :key="col_index">
          <template v-for="(foreign, f_index) in config_table.foreign_list" :key="f_index">
            <el-form-item v-if="col.model == f_index && col.search == 'true'" class="z-col">
              <el-select
                v-model.trim="queryForm.search[col.field]"
                clearable
                filterable
                :placeholder="'请选择' + col.comment"
                @change="foreignChange($event, col.model, col.field)"
              >
                <template v-for="(status_item, status_index) in config_table.foreign_list[col.model]" :key="status_index">
                  <el-option
                    v-if="col.field != 'project_1' && col.field != 'project_2' && col.field != 'project_3'"
                    :label="status_item.name"
                    :value="status_item.id"
                  />
                </template>
                <template v-for="(status_item, status_index) in config_table.foreign_list[col.model]" :key="status_index">
                  <el-option
                    v-if="col.field == 'project_1' && status_item.id <= 4"
                    :key="status_index"
                    :label="status_item.name"
                    :value="status_item.id"
                  />
                </template>
                <template v-for="(status_item, status_index) in config_table.foreign_list[col.model]" :key="status_index">
                  <el-option
                    v-if="col.field == 'project_2' && status_item.id > 4 && status_item.id <= 9"
                    :key="status_index"
                    :label="status_item.name"
                    :value="status_item.id"
                  />
                </template>
                <template v-for="(status_item, status_index) in config_table.foreign_list[col.model]" :key="status_index">
                  <el-option
                    v-if="col.field == 'project_3' && status_item.id > 9"
                    :key="status_index"
                    :label="status_item.name"
                    :value="status_item.id"
                  />
                </template>
              </el-select>
            </el-form-item>
          </template>
        </template>
        <!-- 外键多选 -->
        <template v-for="(col, col_index) in config_table.cols" :key="col_index">
          <template v-for="(selection, s_index) in config_table.selection_list" :key="s_index">
            <el-form-item v-if="col.model == s_index && col.search == 'true'" class="z-col">
              <el-select v-model.trim="queryForm.search[col.field]" clearable filterable multiple :placeholder="'请选择' + col.comment">
                <el-option
                  v-for="(status_item, status_index) in selection_list[col.model]"
                  :key="status_index"
                  :label="status_item.name"
                  :value="status_item.name"
                />
              </el-select>
            </el-form-item>
          </template>
        </template>

        <template v-for="ds in config_table.date_search">
          <el-form-item class="z-col2" label="">
            <el-date-picker
              v-model="queryForm[ds.field]"
              :end-placeholder="ds.name + '结束日期'"
              range-separator="至"
              :start-placeholder="ds.name + '开始日期'"
              type="daterange"
              value-format="YYYY-MM-DD"
            />
          </el-form-item>
        </template>

        <el-form-item v-if="config_table.search != true" class="z-col2">
          <el-input v-model="queryForm.key" clearable :placeholder="'请输入' + config_table.search + '搜索'" style="width: 100%" />
        </el-form-item>

        <el-form-item class="z-col_">
          <el-button :disabled="isLoading" :icon="Search" native-type="submit" type="primary" @click="selectData">查询</el-button>
        </el-form-item>
        <el-form-item class="z-col_">
          <el-button
            v-if="!isclient && type == 1"
            :disabled="isLoading"
            :icon="Expand"
            native-type="submit"
            type="warning"
            @click="exportInfo"
          >
            导出信息
          </el-button>
        </el-form-item>
        <el-form-item class="z-col_" style="padding-left: 30px">
          <el-button v-if="!isclient" :disabled="isLoading" :icon="Expand" native-type="submit" type="success" @click="exportScore">
            导出成绩
          </el-button>
        </el-form-item>
        <!-- <el-form-item class="z-col_" style="padding-left: 60px">
          <el-button
            v-if="!isclient"
            :disabled="isLoading"
            :icon="Expand"
            native-type="submit"
            type="success"
            color="#409118"
            @click="exportLine"
          >
            导出组别
          </el-button>
        </el-form-item> -->
        <el-form-item class="z-col_" style="padding-left: 90px">
          <el-button
            v-if="!isclient && type == 1"
            color="rgb(24 141 145)"
            :disabled="isLoading"
            :icon="Expand"
            native-type="submit"
            type="success"
            @click="prints"
          >
            班级打印
          </el-button>
        </el-form-item>
        <el-form-item class="z-col_" style="padding-left: 120px">
          <el-button
            v-if="!isclient && type == 1"
            color="rgb(24 141 145)"
            :disabled="isLoading"
            :icon="Expand"
            native-type="submit"
            type="success"
            @click="printCode"
          >
            班级学生码
          </el-button>
        </el-form-item>
        <!-- <el-form-item class="z-col_">
          <el-button
            v-if="type == 2"
            color="rgb(24 141 145)"
            :disabled="isLoading"
            :icon="Expand"
            native-type="submit"
            type="success"
            @click="check"
          >
            成绩校验
          </el-button>
        </el-form-item> -->
        <!-- <el-form-item class="z-col_">
          <el-button
            v-if="type == 2"
            color="rgb(24 141 145)"
            :disabled="isLoading"
            :icon="Expand"
            native-type="submit"
            type="success"
            @click="repeat"
          >
            查重
          </el-button>
        </el-form-item>
        <el-form-item class="z-col_">
          <el-button
            v-if="type == 2"
            color="rgb(124 89 119)"
            :disabled="isLoading"
            :icon="Expand"
            native-type="submit"
            type="success"
            @click="export_repeat"
          >
            导重
          </el-button>
        </el-form-item> -->
        <!-- <el-form-item style="padding-left: 200px">
          <el-button :disabled="isLoading" :icon="Expand" native-type="submit" type="danger" @click="dataScreen">考场大屏幕</el-button>
        </el-form-item>
        <el-form-item style="padding-left: 230px">
          <el-button :disabled="isLoading" :icon="Expand" native-type="submit" color="#040d32" type="danger" @click="dataReport">
            统计大屏幕
          </el-button>
        </el-form-item> -->
        <el-form-item style="padding-left: 200px" v-if="config_table.export == '1'" class="z-col_">
          <el-button :icon="Expand" type="primary" @click="exportData">导出</el-button>
        </el-form-item>
      </el-form>
    </vab-query-form-top-panel>

    <vab-query-form-left-panel>
      <el-button v-if="config_table.sys_config" :icon="Download" type="success" @click="download(0)">下载正考</el-button>
      <el-button v-if="config_table.sys_config" :icon="Download" type="danger" @click="download(1)">更新数据</el-button>
      <el-button v-if="config_table.sys_config" :icon="Upload" type="warning" @click="upload">上传数据</el-button>
      <el-button v-if="config_table.sys_config" :icon="Delete" type="info" @click="truncate">清空数据</el-button>
      <el-button v-if="!is_recycle && config_table._add == '1'" :icon="Plus" type="primary" @click="add">添加</el-button>
      <el-button v-if="!is_recycle && config_table._del == '1'" :icon="Delete" type="danger" @click="del">删除</el-button>

      <el-button v-if="isclient" :icon="SetUp" type="success" @click="read_this_card_select">读卡并查询</el-button>

      <el-button v-if="isclient" :icon="SetUp" type="warning" @click="read_this_card">读卡校验</el-button>

      <el-button v-if="!isclient && !is_recycle && config_table.import == '1'" :icon="Plus" type="warning" @click="importTemplate">
        导入模板
      </el-button>

      <import-data v-if="!isclient && !is_recycle && config_table.import == '1'" :tablename="config_table.tablename" @get-data="getData" />

      <template v-for="(btn, btn_index) in btn_arr" :key="btn_index">
        <el-button v-if="!is_recycle && btn.name" :type="btn.type" @click="btnCallback(btn.method)">{{ btn.name }}</el-button>
      </template>
      <el-button v-if="is_recycle" :icon="Plus" type="primary" @click="recovery">恢复</el-button>
      <el-button v-if="is_recycle" :icon="Delete" type="danger" @click="com_del">彻底删除</el-button>
    </vab-query-form-left-panel>
    <vab-query-form-right-panel v-if="config_table._del == '1' && config_table.recycle == true">
      <div class="custom-table-right-tools">
        <el-button v-if="!is_recycle && config_table.login_log.accountid == '1'" type="info" @click="recycle">
          <vab-icon icon="recycle-fill" />
          <span>回收站</span>
        </el-button>
        <el-button v-else type="info" @click="getData">
          <vab-icon icon="arrow-left-double-fill" />
          <span>返回</span>
        </el-button>
      </div>
    </vab-query-form-right-panel>
  </vab-query-form>
</template>

<script lang="ts" setup>
import { Delete, Download, Expand, Plus, Search, Upload } from '@element-plus/icons-vue'
import { ElLoading } from 'element-plus'
import { api_download, api_truncate,api } from '/@/api/obj'

defineOptions({
  name: 'StudentOpbar',
})
const $baseConfirm = inject<any>('$baseConfirm')
const $baseMessage = inject<any>('$baseMessage')
const props = defineProps({
  is_recycle: {
    type: Boolean,
    default: false,
  },
  config_table: {
    type: Object,
    default: {},
  },
  //按钮数组
  btn_arr: {
    type: Array,
    default: [{}], //name,method
  },
  exportMethod: {
    type: String,
    default: 'exportData', //name,method
  },
  type: {
    type: String,
    default: '', //name,method
  },
  isclient: {
    type: Boolean,
    default: false,
  },
})

const emit = defineEmits([
  'fetch-data',
  'add',
  'del',
  'recovery',
  'com_del',
  'recycle',
  'getData',
  'btnCallback',
  'foreignChange',
  'upload',
  'read_this_card_select',
  'read_this_card',
  'prints',
  'printCode',
  'repeat',
])
const isLoading = ref(false)
const queryForm = reactive<any>({
  page: 1,
  page_num: 10,
  sort: '',
  key: '',
  orderby: '',
  search: {},
})

const check = () => {
  $baseConfirm('您确定要提交至市局做数据校验吗', null, async () => {
    const loading = ElLoading.service({
      lock: true,
      text: 'Loading',
      background: 'rgba(0, 0, 0, 0.7)',
    })
    const { msg }: any = await api('sport_zk_exam', 'check','get',{})
    $baseMessage(msg, 'success', 'hey')
    loading.close()
    await getData()
  })
}

//清空数据
const truncate = () => {
  //表示当前状态为0，为正常状态，点击提示是否下号

  $baseConfirm('您确定要清空数据吗', null, async () => {
    const loading = ElLoading.service({
      lock: true,
      text: 'Loading',
      background: 'rgba(0, 0, 0, 0.7)',
    })
    const { msg }: any = await api_truncate(props.config_table.tablename, {})
    $baseMessage(msg, 'success', 'hey')
    loading.close()
    await getData()
  })
}
//下载数据
const download = (status: any) => {
  console.log(props.type)
  //表示当前状态为0，为正常状态，点击提示是否下号
  $baseConfirm('您确定要下载数据吗', null, async () => {
    const loading = ElLoading.service({
      lock: true,
      text: 'Loading',
      background: 'rgba(0, 0, 0, 0.7)',
    })
    const { msg }: any = await api_download(props.config_table.tablename, { examType: status })
    loading.close()
    if (msg == '操作成功') {
      $baseMessage(msg, 'success', 'hey')
    } else {
      $baseMessage(msg, 'error', 'hey')
    }

    await getData()
  })
}
//上传数据
const upload = () => {
  isLoading.value = true
  if (queryForm.search) {
    //json转字符串
    queryForm.search = JSON.stringify(queryForm.search)
  }
  //调用主框架中的方法
  emit('upload', queryForm)
  if (queryForm.search) {
    //字符串转json
    queryForm.search = JSON.parse(queryForm.search)
  }
  isLoading.value = false
  // console.log(queryForm)
  // //表示当前状态为0，为正常状态，点击提示是否下号
  // $baseConfirm('您确定要上传数据吗', null, async () => {
  //   const loading = ElLoading.service({
  //     lock: true,
  //     text: 'Loading',
  //     background: 'rgba(0, 0, 0, 0.7)',
  //   })
  //   const { msg }: any = await api_upload(props.config_table.tablename, {})
  //   $baseMessage(msg, 'success', 'hey')
  //   loading.close()
  //   await getData()
  // })
}

//导出排队
const exportLine = () => {
  console.log(queryForm.search)
  if (queryForm.search.exam_id) {
    if (props.type == '1') {
      // if (!queryForm.search.grade_id && !queryForm.search.class_id) {
      //   $baseMessage('请选择年级和班级', 'error', 'hey')
      //   return false
      // }
      // if (!queryForm.search.grade_id) {
      //   $baseMessage('请选择年级', 'error', 'hey')
      //   return false
      // }
      // if (!queryForm.search.class_id) {
      //   $baseMessage('请选择班级', 'error', 'hey')
      //   return false
      // }
    }

    if (queryForm.search) {
      //json转字符串
      queryForm.search = JSON.stringify(queryForm.search)
    }
    window.open(
      `${import.meta.env.VITE_APP_BASE_URL}${props.config_table.tablename}/exportLine?key=${queryForm.key}&sort=${queryForm.sort}&orderby=${
        queryForm.orderby
      }&search=${queryForm.search}`,
      '_blank'
    )
    if (queryForm.search) {
      //字符串转json
      queryForm.search = JSON.parse(queryForm.search)
    }
  } else {
    $baseMessage('请选择考场', 'error', 'hey')
  }
}
//导出重复考生
const export_repeat = () => {
  if (queryForm.search.exam_id) {
    window.open(
      `${import.meta.env.VITE_APP_BASE_URL}${props.config_table.tablename}/exportRepeat?exam_id=${queryForm.search.exam_id}`,
      '_blank'
    )
  } else {
    $baseMessage('请选择考场', 'error', 'hey')
  }
}

//导出成绩
const exportScore = () => {
  if (queryForm.search.exam_id) {
    if (queryForm.search) {
      //json转字符串
      queryForm.search = JSON.stringify(queryForm.search)
    }
    window.open(
      `${import.meta.env.VITE_APP_BASE_URL}${props.config_table.tablename}/exportScore?key=${queryForm.key}&sort=${queryForm.sort}&orderby=${
        queryForm.orderby
      }&search=${queryForm.search}`,
      '_blank'
    )
    if (queryForm.search) {
      //字符串转json
      queryForm.search = JSON.parse(queryForm.search)
    }
  } else {
    $baseMessage('请选择考场', 'error', 'hey')
  }
}
//进入考场大屏幕
const dataScreen = () => {
  if (queryForm.search.exam_id) {
    window.open(`/#/jk/screen?exam_id=${queryForm.search.exam_id}`, '_blank')
  } else {
    $baseMessage('请选择考场', 'error', 'hey')
  }
}
const dataReport = () => {
  if (queryForm.search.exam_id) {
    window.open(`/#/jk/report?exam_id=${queryForm.search.exam_id}`, '_blank')
  } else {
    $baseMessage('请选择考场', 'error', 'hey')
  }
}

//导出班级
const exportInfo = () => {
  if (queryForm.search.exam_id) {
    if (queryForm.search) {
      //json转字符串
      queryForm.search = JSON.stringify(queryForm.search)
    }
    window.open(
      `${import.meta.env.VITE_APP_BASE_URL}${props.config_table.tablename}/exportInfo?key=${queryForm.key}&sort=${queryForm.sort}&orderby=${
        queryForm.orderby
      }&search=${queryForm.search}`,
      '_blank'
    )
    if (queryForm.search) {
      //字符串转json
      queryForm.search = JSON.parse(queryForm.search)
    }
  } else {
    $baseMessage('请选择考场', 'error', 'hey')
  }
}
//导出数据
const exportData = () => {
  if (queryForm.search.exam_id) {
    if (queryForm.search) {
      //json转字符串
      queryForm.search = JSON.stringify(queryForm.search)
    }
    let date_search = ''
    for (let i = 0; i < props.config_table.date_search.length; i++) {
      if (queryForm[props.config_table.date_search[i].field]) {
        date_search += `&${props.config_table.date_search[i].field}=${queryForm[props.config_table.date_search[i].field]}`
      }
    }
    window.open(
      `${import.meta.env.VITE_APP_BASE_URL}${props.config_table.tablename}/${props.exportMethod}?key=${queryForm.key}&sort=${queryForm.sort}&orderby=${
        queryForm.orderby
      }&search=${queryForm.search}${date_search}`,
      '_blank'
    )
    if (queryForm.search) {
      //字符串转json
      queryForm.search = JSON.parse(queryForm.search)
    }
  } else {
    $baseMessage('请选择考场', 'error', 'hey')
  }
}
//外键更换
const foreignChange = ($event: any, model: any, field: any) => {
  //调用主框架中的方法
  console.log(1)
  emit('foreignChange', $event, model, field)
}

const read_this_card_select = (method: any) => {
  //调用主框架中的方法
  emit('read_this_card_select', method)
}
const read_this_card = (method: any) => {
  //调用主框架中的方法
  emit('read_this_card', method)
}
const btnCallback = (method: any) => {
  //调用主框架中的方法
  emit('btnCallback', method)
}
//查看数据
const printCode = () => {
  console.log(queryForm.search)
  if (queryForm.search.exam_id) {
    if (props.type == '1') {
      // if (!queryForm.search.grade_id && !queryForm.search.class_id) {
      //   $baseMessage('请选择年级', 'error', 'hey')
      //   return false
      // }
      // if (!queryForm.search.grade_id) {
      //   $baseMessage('请选择年级', 'error', 'hey')
      //   return false
      // }
      // if (!queryForm.search.class_id) {
      //   $baseMessage('请选择班级', 'error', 'hey')
      //   return false
      // }
    } else {
      if (!queryForm.search.group_id) {
        $baseMessage('请选择组别', 'error', 'hey')
        return false
      }
    }

    // if (queryForm.search) {
    //   //json转字符串
    //   queryForm.search = JSON.stringify(queryForm.search)
    // }
    emit('printCode', queryForm.search)
    // if (queryForm.search) {
    //   //字符串转json
    //   queryForm.search = JSON.parse(queryForm.search)
    // }
  } else {
    $baseMessage('请选择考场', 'error', 'hey')
  }
}
const prints = () => {
  //调用主框架中的方法

  console.log(queryForm.search)
  if (queryForm.search.exam_id) {
    if (props.type == '1') {
      // if (!queryForm.search.grade_id && !queryForm.search.class_id) {
      //   $baseMessage('请选择年级和班级', 'error', 'hey')
      //   return false
      // }
      // if (!queryForm.search.grade_id) {
      //   $baseMessage('请选择年级', 'error', 'hey')
      //   return false
      // }
      // if (!queryForm.search.class_id) {
      //   $baseMessage('请选择班级', 'error', 'hey')
      //   return false
      // }
    } else {
      if (!queryForm.search.group_id) {
        $baseMessage('请选择组别', 'error', 'hey')
        return false
      }
    }

    // if (queryForm.search) {
    //   //json转字符串
    //   queryForm.search = JSON.stringify(queryForm.search)
    // }
    emit('prints', queryForm.search)
    // if (queryForm.search) {
    //   //字符串转json
    //   queryForm.search = JSON.parse(queryForm.search)
    // }
  } else {
    $baseMessage('请选择考场', 'error', 'hey')
  }
}

const repeat = () => {
  console.log(queryForm.search)
  if (queryForm.search.exam_id) {
    emit('repeat', queryForm.search)
  } else {
    $baseMessage('请选择考场', 'error', 'hey')
  }
}

//查看数据
const getData = () => {
  //调用主框架中的方法
  emit('getData')
}
//查看回收站
const recycle = () => {
  //调用主框架中的方法
  emit('recycle')
}
//进行添加
const add = () => {
  //调用主框架中的方法
  emit('add')
}
//进行批量删除
const del = () => {
  //调用主框架中的方法
  emit('del', false)
}
//进行批量恢复
const recovery = () => {
  //调用主框架中的方法
  emit('recovery', false)
}
//进行批量彻底删除
const com_del = () => {
  //调用主框架中的方法
  emit('com_del', false)
}
//获取导入模板
const importTemplate = () => {
  if (props.type == '1') {
    //表示健康
    window.open(`${import.meta.env.VITE_APP_BASE_URL}/${props.config_table.tablename}/import_example`, '_blank')
  } else {
    window.open(`${import.meta.env.VITE_APP_BASE_URL}../import_example/中考学生档案-导入模板.xls`, '_blank')
  }
}
//进行搜索
const selectData = () => {
  isLoading.value = true
  if (queryForm.search) {
    //json转字符串
    queryForm.search = JSON.stringify(queryForm.search)
  }
  //调用主框架中的方法
  emit('fetch-data', queryForm)
  if (queryForm.search) {
    //字符串转json
    queryForm.search = JSON.parse(queryForm.search)
  }
  isLoading.value = false
}
</script>
<style scoped>
.z-col {
  width: 188px;
  padding: 5px;
}
.z-col_ {
  width: 88px;
  padding: 5px;
}

.z-col2 {
  width: 300px;
  padding: 5px;
}
</style>
